module.exports = {
    content: ["./*.{html,js}"],
    theme: {
        extend: {
            content: {
                'link': '<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>',
            },
            transitionProperty: {
                'height': 'height',
                'spacing': 'margin, padding',
                'bottom': 'bottom',
                'width': 'width',
            }
        }
    },
    plugins: [
        function ({ addVariant }) {
            addVariant('child', '& > *');
            addVariant('child-hover', '& > *:hover');
        },
        function ({ addVariant }) {
            addVariant('children', '& ~ a');
            addVariant('children-hover', '& ~ *:hover');
        }
    ],
}
